<script setup lang="ts">

defineOptions({
  name: "Editor"
});
import { ref } from 'vue';
import a加个X from './加个X.vue';
import a禹神input from './a禹神input.vue';
const 标题 = ref(null)
const username = ref(null)

</script>

<template>
  <div class=" q-gutter-lg">
    <h6>v-model 父子组件通信：</h6>
    <div>父组件的username:{{ username }}</div>
    <!-- <a禹神input v-model="username"/> -->
    <!-- 完整形式如下 -->
    <!-- 对于自定义事件，$event是触发事件是传递的值，不能像原生事件那样.target! -->
    <a禹神input :modelValue="username" @update:modelValue="username = $event" />
  </div>


  <div class="row q-gutter-lg q-mt-lg">
    <a加个X v-model="标题" label="标题" lazy-rules label-color="orange" clearable />
    <q-input v-model="标题" type="text" label="Label" clearable/>
  </div>

</template>

<style scoped></style>
